<template>
  <div class="postList">
    <el-table ref="postList" :data="postList" tooltip-effect="dark" style="width:100%">
      <el-table-column label="id" min-width="60">
        <template slot-scope="scope">{{scope.row.id}}</template>
      </el-table-column>
      <el-table-column label="标题" min-width="120">
        <template slot-scope="scope"><p class="overflow postTitle">{{scope.row.title}}</p></template>
      </el-table-column>
      <el-table-column label="发帖人" min-width="60">
        <template slot-scope="scope">{{scope.row.nickName}}</template>
      </el-table-column>
      <el-table-column label="发帖时间" min-width="80">
        <template slot-scope="scope">{{scope.row.createDate | formatDate}}</template>
      </el-table-column>
      <el-table-column label="获赞数" min-width="40">
        <template slot-scope="scope">{{scope.row.thumbs}}</template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-tooltip class="item" effect="dark" content="发布" placement="bottom" :enterable="false">
            <el-button @click="showEditModal(scope.row.id)" type="primary" size="mini" icon="el-icon-upload" circle></el-button>
          </el-tooltip>
          <el-tooltip class="item" effect="dark" content="删除" placement="bottom" :enterable="false">
            <el-button @click="deleteSingle(scope.$index)" type="danger" size="mini" icon="el-icon-delete" circle></circle></el-button>
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  export default {
    name: 'postList',
    components: {
    },
    data(){
      return {
        postList: this.$test.postList
      }
    },
    methods: {
    },
    created() {
    }
  }
</script>

<style lang="scss" scoped>
.postList{
  .postTitle{
    width: 100%;
  }
}
</style>